<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>增删改查</title>
</head>
<body>
    <button onclick = "add()">点击添加一个记录</button>
    <button onclick="getItem()">点击根据Key值拿到数据</button>
    <button onclick="deleteItem()">点击根据Key值删除改数据</button>
    <button onclick="clearItem()">点击清楚浏览器本地存储</button>
   <script>
       const person = {
           name:'软罗兰',
           age:'22'
       }
    //    添加和修改
       function add(){
        //    需要采用JSON.stringify()方法换换成JSON数据
            localStorage.setItem('person',JSON.stringify(person))
       }
    //    获取
       function getItem(){
          console.log( JSON.parse(localStorage.getItem('person')))
       }
    //    删除
       function deleteItem(){
          localStorage.removeItem('person')
       }
    //   清除
    function clearItem(){
        localStorage.clear()
    }
   </script>
</body>
</html>